<template>
  <div>
    <bpmn-modeler
      ref="refNode"
      :xml="xml"
      :users="users"
      :groups="groups"
      :categorys="categorys"
      :is-view="false"
      @save="save"
    />
  </div>
</template>

<script>
import bpmnModeler from 'workflow-bpmn-modeler'
import {groupsAndUsersList,saveXmlAndSvg} from 'api/activiti'
export default {
  name: "model",
  components: {
    bpmnModeler,
  },
  data () {
    return {
      xml: '', // 后端查询到的xml
      users: [
        {name: '张三', id: 'zhangsan'},
        {name: '李四', id: 'lisi'},
        {name: '王五', id: 'wangwu'},
      ],
      groups: [
        {name: 'web组', id: 'web'},
        {name: 'java组', id: 'java'},
        {name: 'python组', id: 'python'},
      ],
      categorys: [
        {name: 'OA', id: 'oa'},
        {name: '财务', id: 'finance'},
      ],
      model:{
        process:'',
        svg:'',
        xml:'',
      }
    }
  },
  created() {
    this.getGroupsAndUsers();
    //this.getCategorys();
  },
  methods: {
    getModelDetail () {
      // 发送请求，获取xml
      // this.xml = response.xml
    },
    save (data) {
      console.log("这里请求后台部署",data)  // { process: {...}, xml: '...', svg: '...' }
      this.model = data;
      //保存xml,svg
      saveXmlAndSvg(this.model).then()(res=>{
        console.log("0000000000000000", res.data.msg)
      })

    },
    getGroupsAndUsers(){
      groupsAndUsersList().then(res => {
        this.groups = res.data.groupList
        this.users = res.data.userList
      })
    },
  },
}
</script>
